import { useReducer } from "react"

// 相当于状态管理

const initialState = {
    count: 10
}

const reducer = (state, action) => {
    switch (action.type) {
        case 'increment':
            return { ...state, count: state.count + 1 }
        case 'decrement':
            return { ...state, count: state.count - 1 }
        default:
            return state
    }
}

const App = () => {
    const [ state, dispatch ] = useReducer(reducer, initialState)
    return (
        <>
        <button onClick = {() => {
            dispatch({type: 'decrement'})
        }}>-</button>
        { state.count }
        <button onClick = {() => {
            dispatch({type: 'increment'})
        }}>+</button>
        </>
    )
}

export default App